<!-- 支付 -->
<template>
  <div class="">
    <div class="card-view _p-20 disFlxJS">
      <div>
        <h6 style="margin-bottom: 0;font-weight: bolder;">人脉资源跨界合作开关</h6>
        <div class="tips _mt-5">
          默认关闭，开启后则两个组织合作选择人脉互通后，本组织的人脉将展示到合作组织的人脉中。
        </div>
      </div>
      <a-switch :checked="isChecked" :defaultChecked="isChecked" @change="handleChangeIsOpen" />
    </div>
    <div class="card-view _p-20 _mt-30">
      <div class="disFlxAC">
        <h6 class="_mr-20" style="margin-bottom: 0;font-weight: bolder;">会外人脉解锁审核开关</h6>
        <a-select v-model="isAudit" style="width: 100px">
          <a-select-option :value="1">审核</a-select-option>
          <a-select-option :value="0">无需审核</a-select-option>
        </a-select>
        <span class="tips _ml-20"
          >默认无需审核，人脉解锁无需审核；开启后，则每一个人脉解锁都将需要管理员审核后才能往下进行。</span
        >
      </div>
      <div class="disFlxAC _mt-20" style="align-items: start;">
        <h6 class="_mr-20" style="margin-bottom: 0;font-weight: bolder;">会外申请审核人</h6>
        <a-select
          :value="getManagerList"
          mode="multiple"
          style="width: 400px"
          placeholder="请选择"
          @select="handleSelect"
          @deselect="handleDeselect"
        >
          <a-select-option v-for="item in user_list" :key="item.userId">{{ item.userName }}</a-select-option>
        </a-select>
      </div>
    </div>
    <div class="card-view _p-20 _mt-30">
      <h6 style="margin-bottom: 0;font-weight: bolder;">会外人脉解锁价格</h6>
      <div class="disFlxAC _ml-20 _mt-20">
        <h6 class="_mr-20" style="margin-bottom: 0;">会外人脉解锁价格</h6>
        <span class="tips">秘书处联络（￥）</span>
        <a-input-number v-model="price2" :min="0" placeholder="请输入" style="width: 200px;" />
        <span class="tips _ml-20">价格设置为0,则为免费</span>
      </div>
    </div>

    <div class="card-view _p-20 _mt-30">
      <h6 style="margin-bottom: 0;font-weight: bolder;">
        会外人脉合作佣金比例
      </h6>
      <div class="disFlxAC _ml-20 _mt-20">
        <h6 class="_mr-20" style="margin-bottom: 0;">会外秘书处联络佣金</h6>
        <span class="tips">佣金比例（￥）</span>
        <a-input-number v-model="percent" :min="0" placeholder="请输入" style="width: 200px;" />
        <span class="_ml-6">%</span>
        <span class="tips _ml-20">此为默认佣金比例，具体合作时可修改调整比例</span>
      </div>
    </div>

    <div class="disFlxCC _mt-20">
      <a-button type="primary" size="large" style="width: 200px" @click="handleTenantSave">保存</a-button>
    </div>
  </div>
</template>

<script>
import { orgGetTenantInfoByProjectType, orgTenantOneSave } from '@/api/system/base'
import { getUserList } from '@/api/system/system'
import { ManagerAdd, ManagerDel } from '@/api/business/source'
import { Modal } from 'ant-design-vue'

export default {
  components: {},
  data() {
    return {
      /** 对外合作开关 */
      isOpen: 0,
      /** 是否审核 */
      isAudit: 0,
      /** 会外人脉解锁价格 */
      price2: 0,
      /** 会外佣金比例 */
      percent: 0,
      /** 审核人列表 */
      managerList: [],
      /** 管理员列表 */
      user_list: [],
      projectType: 1
    }
  },
  computed: {
    getManagerList() {
      return this.managerList.map(item => item.systemId)
    },
    isChecked() {
      return this.isOpen === 0
    }
  },
  watch: {},
  methods: {
    async GetUserList() {
      let res = await getUserList()
      this.user_list = res.rows || []
    },
    async handleSelect(val) {
      let item = this.user_list.find(f => f.userId === val) || {}
      const params = {
        systemId: val,
        systemName: item.userName,
        systemPhone: item.phonenumber,
        projectType: this.projectType,
        type: 1 //会外
      }
      let { code, msg, data } = await ManagerAdd(params)
      if (code === 0) this.managerList.push({ ...params, id: data.id })
      this.$message[code === 0 ? 'success' : 'error'](msg)
      if (code != 0) this.userIds.pop()
    },
    async handleDeselect(val) {
      const index = (this.managerList || []).findIndex(f => f.systemId === val)
      let item = this.managerList[index]
      let { code, msg } = await ManagerDel(item.id)
      if (code === 0) this.managerList.splice(index, 1)
      this.$message[code === 0 ? 'success' : 'error'](msg)
    },
    handleTenantSave() {
      const data = {
        isAudit: this.isAudit,
        price2: this.price2,
        percent: this.percent,
        managerList: this.managerList,
        projectType: this.projectType,
        isOpen: this.isOpen
      }
      if (data.isAudit === 1 && !data.managerList.length) return this.$message.error('解锁需审核时，审核人不能为空')
      orgTenantOneSave(data).then(({ code, msg }) => {
        if (code === 90001) {
          Modal.confirm({
            title: '提示',
            content: msg,
            cancelText: '暂不开通',
            okText: '去开通',
            onCancel: () => {},
            onOk: () => {
              this.$router.push({
                path: '/system/paySettings',
                query: {
                  titleKey: 'onlinePayment'
                }
              })
            }
          })
        } else if (code === 0) {
          this.$message.success('保存成功')
        }
      })
    },

    handleChangeIsOpen(val) {
      this.isOpen = val ? 0 : 1
    }
  },
  created() {
    this.GetUserList()
    orgGetTenantInfoByProjectType(this.projectType).then(r => {
      if (!r.code && r.data) {
        const res = r.data
        this.isAudit = res.isAudit
        this.price2 = res.price2
        this.percent = res.percent
        this.managerList = res.managerList
        this.isOpen = res.isOpen
      }
    })
  },
  mounted() {}
}
</script>
<style lang="less" scoped>
.card-view {
  background-color: #f7f8fa;
}

.tips {
  color: rgb(108, 108, 108);
  font-size: 14px;
}
</style>
